$(function() {
    var url = 'http://localhost:3000/pl/public.php?action=placetop10'
$.get(url, data => {
    console.log(JSON.parse(data))
    data = JSON.parse(data)
    $('.main>.hot>div>div>ul.country').html(
        data.data.country.data.map(value => {
            const { h5_url, name, trend_status, we_url, rank } = value
            return `
            <li><span>${rank}</span><p><a href="${h5_url}">${name}</a></p></li>
            `
        })
    )
    $('.main>.hot>div>div>ul.city').html(
        data.data.abroad_city.data.map(value => {
            const { h5_url, name, trend_status, we_url, rank } = value
            return `
            <li><span>${rank}</span><p><a href="${h5_url}">${name}</a></p></li>
            `
        })
    )
    $('.main>.hot>div>div>ul.country-side').html(
        data.data.domestic_city.data.map(value => {
            const { h5_url, name, trend_status, we_url, rank } = value
            return `
            <li><span>${rank}</span><p><a href="${h5_url}">${name}</a></p></li>
            `
        })
    )
    $('.main>.hot>div>div>ul.scenic-spot').html(
        data.data.poi.data.map(value => {
            const { h5_url, name, trend_status, we_url, rank } = value
            return `
            <li><span>${rank}</span><p><a href="${h5_url}">${name}</a></p></li>
            `
        })
    )
})
var url = 'http://localhost:3000/v1/place/hot_city'
$.get(url, data => {
    console.log(data)
    $('.hot-city>div>ul').html(
        data.data.map(value => {
            return `<li>${value.place}</li>`
        })
    )
})
var url = 'http://localhost:3000/v1/place/topic'
$.get(url, data => {
    console.log(data)
    $('.place>ul').html(
        data.data.map(value => {
            return `<li>${value.title}</li>`
        })
    )
    $('.place>ul>li').eq(0).addClass('active')
    
    $('.place>ul>li').hover(function(){
        $(this).addClass('active').siblings().removeClass('active')
        var i = $(this).index()
        place_detail(i+1)
    })
})

function place_detail(num){
    var url = 'http://localhost:3000/v1/place/topic_detail'
$.get(url, {pages:num},data => {
    console.log(data)
    $('.place>div>ul').html(
        data.data.map(value => {
            return `<li><img src="${value.pic}" alt=""></li>`
        })
    )
})
}
place_detail(1)
function mon(mon){
    var url = 'http://localhost:3000/v1/place/mon_city'
$.get(url,{month:mon}, data => {
    console.log(data)
    $('.month-com>div>ul').html(
        data.data.map(value => {
            return `<li><img src="${value.pic}" alt=""></li>`
        })
    )
})
}
mon(1)
$('.month-com>ul>li').hover(function() {
    $(this).addClass('active').siblings().removeClass('active')
    let i = $(this).index()
    mon(i+1)
})
function zhou(num){
    var url = 'http://localhost:3000/v1/place/country_list'
$.get(url,{zhou:num} ,data => {
    console.log(data)
    $('.country-list>div>ul').html(
        data.data.map(value => {
            return `<li><p>${value.cname}</p><span>${value.ename}</span></li>`
        })
    )
})
}
zhou(1)
$('.country-list>ul>li').hover(function() {
    $(this).addClass('active').siblings().removeClass('active')
    let i = $(this).index()
    zhou(i+1)
})
})